<template>
	<el-dialog title="系统维护配置" :visible.sync="dialogVisible" width="1000px" @close="handleClose"
		:close-on-click-modal="false">
		<div slot="title" class="dialog-header-title">
			<i class="el-icon-edit-outline"></i>
			<span>系统维护配置</span>
		</div>

		<div class="smp-search" v-if="dialogVisible">
			<el-form :inline="false" label-width="110px" size="mini" ref="form" :model="form" :rules="rules">

				<el-row>
						<el-col :span="8">
							<el-form-item label="系统编号:" prop="systemNo">
								<el-input v-model="form.systemNo" placeholder="系统编号" disabled></el-input>
							</el-form-item>
						</el-col>
						
						<el-col :span="8">
							<el-form-item label="系统名称:" prop="systemName">
								<el-input v-model="form.systemName" placeholder="系统名称" disabled></el-input>
							</el-form-item>
						</el-col>
						
						
						<el-col :span="8">
							<el-form-item label="系统类别:" prop="systemType">
								<!-- <el-input v-model="form.systemType" placeholder="系统类别"></el-input> -->
								<el-select v-model="form.systemType" style="width: 100%" placeholder="系统类别" disabled>
									<el-option v-for="item in dict('SMP0014')" :key="item.itemCode" :label="item.itemName" :value="item.itemCode"></el-option>
								</el-select>
							</el-form-item>
						</el-col>
						
						<el-col :span="8">
							<el-form-item label="所属机构:" prop="systemOrg">
							<el-select disabled  v-model="form.systemOrg" style="width: 100%" placeholder="所属机构" >
								<!-- <el-option v-for="item in dict('SMP0016')" :key="item.itemCode" :label="item.itemName" :value="item.itemCode"></el-option> -->
								<el-option v-for="item in orgListAll" :key="item.seqCate" :label="item.orgName" :value="item.seqCate"></el-option>
							</el-select>
							</el-form-item>
						</el-col>
						
						<el-col :span="8" v-if="form.systemOrg=='9999'">
							<el-form-item label="第三方名称:" prop="trdName" >
							<el-input disabled v-model="form.trdName" placeholder="第三方名称"></el-input> 
							</el-form-item>
						</el-col>
						
						<el-col :span="8">
							<el-form-item label="ESB标准报文:" prop="standardFlg">
								<el-select v-model="form.standardFlg" style="width: 100%" placeholder="申请类型" disabled>
									<el-option v-for="item in dict('SMP0015')" :key="item.itemCode" :label="item.itemName" :value="item.itemCode"></el-option>
								</el-select>
							</el-form-item>
						</el-col>
						
						
						<el-col :span="8">
							<el-form-item label="字符编码:" prop="msgCode">
								
								<el-select v-model="form.msgCode" style="width: 100%" placeholder="字符编码" disabled>
									<el-option v-for="item in dict('SMP0004')" :key="item.itemCode" :label="item.itemName" :value="item.itemCode"></el-option>
								</el-select>
							
							</el-form-item>
						</el-col>
						
						<el-col :span="8">
							<el-form-item label="报文格式:" prop="msgAgreement">
								<el-input placeholder="请选择或输入报文协议" v-model="form.msgAgreement" disabled/>
							</el-form-item>
						</el-col>
						
						<el-col :span="8">
							<el-form-item label="系统负责人:" prop="systemResponsibleMan" >
							<el-select disabled v-model="form.systemResponsibleMan" style="width: 100%" filterable remote reserve-keyword
								placeholder="系统负责人" :remote-method="getUsers" >
								<el-option v-for="item in userListAll" :key="item.userName" :label="item.userChineseName"
									:value="item.userName">
									<span style="float: left;margin-left: 3px;">{{ item.userChineseName }}</span>
									<span style="float: right;margin-right: 3px;">{{ item.department }}</span>
								</el-option>
							</el-select>	
							</el-form-item>
						</el-col>
						
						<el-col :span="8">
							<el-form-item label="关联ESB地址:" prop="esbAddr">								
								<el-select v-model="form.esbAddr" style="width: 100%" placeholder="字符编码" disabled>
									<!-- <el-option v-for="item in dict('SMP0016')" :key="item.itemCode" :label="item.itemName" :value="item.itemCode"></el-option> -->
									<el-option v-for="item in esbEnvironmentList" :key="item.ip" :label="item.ip+'('+dictName(item.esbFlg,'SMP0031')+')'" :value="item.ip"></el-option>
								</el-select>
							</el-form-item>
						</el-col>
						
						<el-col :span="24">
							<el-form-item label="测试URL:" prop="testAddr">
								<el-input v-model="form.testAddr" placeholder="eg:tcp://127.0.0.1:16500" disabled></el-input>
							</el-form-item>
						</el-col>
						
						<!-- <el-col :span="24">
							<el-form-item label="生产URL:" prop="prodAddr">
								<el-input v-model="form.prodAddr" placeholder="eg:tcp://127.0.0.1:16500" disabled></el-input>
							</el-form-item>
						</el-col> -->
						
						<!-- <el-col :span="16">
							<el-form-item label="业务目录:" prop="busPath">
								<el-input v-model="form.busPath" placeholder="业务目录"></el-input>
							</el-form-item>
						</el-col> -->
						<el-col :span="8">
							<el-form-item label="系统简称:" prop="systemShort">
								<el-input v-model="form.systemShort" placeholder="系统简称"></el-input>
							</el-form-item>
						</el-col>
						<!-- <el-col :span="16">
							<el-form-item label="代理目录:" prop="proxyPath">
								<el-input v-model="form.proxyPath" placeholder="代理目录"></el-input>
							</el-form-item>
						</el-col> -->
						<el-col :span="8">
							<el-form-item label="域名(hosts):" prop="hosts">
								<el-input v-model="form.hosts" placeholder="HXYWXTCBS"></el-input>
							</el-form-item>
						</el-col>
						<el-col :span="8">
							<el-form-item label="备注:" prop="remark">
								<el-input v-model="form.remark" placeholder="remark"></el-input>
							</el-form-item>
						</el-col>
						
						<!-- <el-col :span="16">
							<el-form-item label="业务目录(外联):" prop="busPath">
								<el-input v-model="form.oesbBusPath" placeholder="业务目录"></el-input>
							</el-form-item>
						</el-col>
						
						<el-col :span="16">
							<el-form-item label="代理目录(外联):" prop="proxyPath">
								<el-input v-model="form.oesbProxyPath" placeholder="代理目录"></el-input>
							</el-form-item>
						</el-col> -->
						
					<!-- 	<el-col :span="22">
							<el-form-item label="代理路径:" prop="proxyPath">-->
								<!-- <el-input v-model="form.proxyPath" placeholder="代理路径"></el-input> -->
								<!-- <el-select v-model="form.proxyPath" style="width: 100%" filterable remote reserve-keyword
									placeholder="请输入代理路径"
									:loading="proLoading"
									@change="proChange"
									:remote-method="getproxyPathList" >
									<el-option v-for="item in proxyPathList" :key="item.sourcePath" :label="item.sourcePath" :value="item.sourcePath">
										<span style="float: left;margin-left: 3px;">{{ item.sourceName }}</span>
										<span style="float: right;margin-right: 3px;">{{ item.sourcePath }}</span>
									</el-option>
								</el-select>	
							</el-form-item>
						</el-col>
						
						<el-col :span="2">
							<el-button size="mini" type="primary"  @click="addProxyPath" style="width: 78px;"> 创 建 </el-button>
						</el-col> -->
						
						<el-col :span="22">
							<el-form-item label="默认ESB业务路由:" prop="busPath">
								<el-select v-model="form.busPath" style="width: 100%" filterable remote reserve-keyword
									placeholder="请输入业务路由"
									:loading="proLoading"
									@change="proChange"
									:remote-method="getBusPathList" >
									<el-option v-for="item in busPathList" :key="item.sourcePath" :label="item.sourcePath" :value="item.sourcePath">
										<span style="float: left;margin-left: 3px;">{{ item.sourcePath }}</span>
									      <span style="float: right;margin-right: 3px;">{{ item.sourceName }}</span>
									
									</el-option>
								</el-select>
							
							</el-form-item>
						</el-col>
						
						<el-col :span="2" >
							<el-button size="mini" plain type="primary"  @click="addbusPath" > 创建 </el-button>
						</el-col>
						
						<el-col :span="22">
							<el-form-item label="默认OESB业务路由:" prop="oesbBusPath">
								
								<el-select v-model="form.oesbBusPath" style="width: 100%" filterable remote reserve-keyword
									placeholder="请输入业务路由"
									:loading="proLoading"
									@change="proChange"
									:remote-method="getoesbBusPathList" >
									<el-option v-for="item in oesbbusPathList" :key="item.sourcePath" :label="item.sourcePath" :value="item.sourcePath">
										<span style="float: right;margin-right: 3px;">{{ item.sourceName }}</span>
										<span style="float: left;margin-left: 3px;">{{ item.sourcePath }}</span>
									</el-option>
								</el-select>
							</el-form-item>
						</el-col>
						
						<el-col :span="2" >
							<el-button size="mini" plain type="primary"  @click="addoesbbusPath" > 创建 </el-button>
						</el-col>
						
				</el-row>


			</el-form>
		</div>
		
		<addESBSource ref="addESBSource" @changeProxyPath="changeProxyPath"/>
		
		<span slot="footer" class="dialog-footer">
			<el-button size="mini"  type="primary" @click="onSubmit">确定</el-button>
			<el-button size="mini"   @click="closeDialog">取消</el-button>
		</span>
	</el-dialog>
</template>

<script>
	"use strict";
	import {updateApplySystemInfo} from '@/api/demand.js';
	import {getproList,getproListBysourcePath} from '@/api/source.js';
	import addESBSource from './addESBSource';
	import {getEsbEnvironmentByEsbFlg} from '@/api/environment.js';
	
	export default {
		components: {
			addESBSource
		},
		data() {
			return {
				esbEnvironmentList: [],
				dialogVisible: false,
				proxyPathList:[],
				proLoading:false,
				rules: {
					hosts: [{
						required: true,
						message: "域名(hosts)不能为空",
						trigger: ['blur', 'change']
					}],
					systemShort: [{
						required: true,
						message: "系统简称不能为空",
						trigger: ['blur', 'change']
					}],
					busPath: [{
						required: false,
						message: "业务目录不能为空",
						trigger: ['blur', 'change']
					}],
					proxyPath: [{
						required: true,
						message: "代理目录不能为空",
						trigger: ['blur', 'change']
					}]
				},
				busPathList:[],
				oesbbusPathList:[],
				form: {
					hosts: '',
					systemShort: '',
					busPath: '',
					proxyPath: '',
					busPath: '',
					oesbBusPath:''
				},
				
			};
		},
		
		created() {
			this.getEsbEnvironmentList();
		},

		methods: {
			addbusPath(){
				this.$refs.addESBSource.showDialog("03",this.sourceFolder,"01");
			},
			addoesbbusPath(){
				this.$refs.addESBSource.showDialog("03",this.sourceFolder,"02");
			},
			getBusPathList(query){
				if(query!=''){
					this.proLoading = true;
					getproList({"sourcePath":query,"sourceType":"03","esbFlg":"01"}).then(response => {
					this.busPathList = response.data.extend;
					this.proLoading = false;
				});
				}else{
					
					this.busPathList = [];
				}
			},
			
			getoesbBusPathList(query){
				if(query!=''){
					this.proLoading = true;
					getproList({"sourcePath":query,"sourceType":"03","esbFlg":"02"}).then(response => {
					this.oesbbusPathList = response.data.extend;
					this.proLoading = false;
				});
				}else{
					this.oesbbusPathList = [];
				}
			},
			changebusPath(sourcePath){
				//alert("dsgdfgdg");
				getproList({"sourcePath":sourcePath,"sourceType":"03","esbFlg":"01"}).then(response =>{
					this.busPathList = response.data.extend;
					this.form.busPath = sourcePath
				}).catch(error => {
					console.info("失败");
					console.info(error.message);
				})
			},
			
			changeoesbbusPath(sourcePath){
				getproList({"sourcePath":sourcePath,"sourceType":"03","esbFlg":"02"}).then(response =>{
					this.oesbbusPathList = response.data.extend;
					this.form.oesbBusPath = sourcePath
				}).catch(error => {
					console.info("失败");
					console.info(error.message);
				})
			},
			
			getEsbEnvironmentList() {
				getEsbEnvironmentByEsbFlg({}).then(response => {
					this.esbEnvironmentList = response.data.extend;
				})
			},
						
			onSubmit() {
				this.updateApplySystemInfo();
			},

			
			updateApplySystemInfo() {
				this.$refs["form"].validate(valid => {
					if (valid) {
						updateApplySystemInfo(this.form).then(response => {
							this.$message({
						duration:5000,
								type: 'success',
								message: '系统维护配置成功！'
							});
							this.dialogVisible = false;
							this.$emit("getList");

						}).catch(error => {
							this.$message({
						duration:5000,								type: 'error',
								message: '系统维护配置失败！'
							});
							this.dialogVisible = false;
						});
					}
				})

			},

			showDialog(row) {
				this.form = row;
				this.dialogVisible = true;

			},

			closeDialog() {
				this.dialogVisible = false;
			},

			handleClose() {
				this.dialogVisible = false;
			},
			
			//获取代理路径
			getproxyPathList(query){
				if(query!=''){
					this.proLoading = true;
					getproList({"sourcePath":query,"sourceType":"01"}).then(response => {
					this.proxyPathList = response.data.extend;
					this.proLoading = false;
				});
				}
			},
			
			proChange(val){
				this.form.proxyPath = 
				this.proxyPathList.filter(item=>{
					return item.proxyPath == val;
				})[0].proxyPath;
			},
			
			addProxyPath(){
				this.$refs.addESBSource.showDialog("03");
			},
			
			changeProxyPath(sourcePath){
				getproListBysourcePath({"sourcePath":sourcePath,"sourceType":"01"}).then(response =>{
					this.proxyPathList = response.data.extend;
					this.form.proxyPath = this.proxyPathList[0].sourcePath;
				}).catch(error => {
					console.info("失败");
					console.info(error.message);
				})
			},


		},

	}
</script>

<style>
</style>
